<template>
  <div>
    <el-container>
      <el-aside width="200px" style="min-height:100vh;background:#fff">
        <el-menu :defaultActive="activeIndex" router>
          　　　　<template v-for="(item , idx) in sideMenu">
            　　<el-submenu :index="item.loadpage" v-if="item.children.length>0" :key="idx">
              <template slot="title">{{item.name}}</template>
              　　<el-menu-item v-for="(itemChild , idx) in item.children" :index="itemChild.loadpage" :key="idx">
                　　{{itemChild.name}}
                　　</el-menu-item>
            </el-submenu>
            　　　　　　　<el-menu-item :index="item.loadpage" v-else :key="idx">
              <i class="iconfont icon-shengchan"></i>&nbsp;&nbsp;&nbsp;&nbsp;{{item.name}}
              　　</el-menu-item>
            　　　　</template>
          　　</el-menu>
      </el-aside>
      <el-container style="background:#f1f1f1">
        <el-main style="padding:0">
          <nuxt-child/>
        </el-main>
      </el-container>
    </el-container>
  </div>
</template>

<script>
export default {
  data() {
    return {
      sideMenu: [],
      ts: this.newStore(),
      data: null,
    };
  },
  computed: {
    activeIndex() {
      return this.$route.path;
    },
  },
  created() {
    this.getSidemenu();
  },
  methods: {
    getSidemenu() {
      const req = {
        handle: '67A5B6FEF17D97DECF116BDF95B95C0B843B7A441565EC6C4A6860EBB8D9E769',
        supid: '102',
      };
      this.spost(this.ts, '/mainservlet', req).then((ts) => {
        this.data = ts.d.data.operation1[0].hash.privstr;
        this.sideMenu = JSON.parse(this.data);
      });
    },
  },
};

</script>


<style lang="stylus" scoped>
.el-menu-item i
  font-size 20px
.menu_i
  float left
.el-menu-item
  text-align left
  border-bottom 1px solid #e6e6e6
.el-submenu.is-active .el-submenu__title
  border-bottom-color #e6e6e6

.el-menu-item.is-active
  background #f1f1f1
  color black
.el-submenu__title
  padding-left 33px
  border-bottom 1px solid #f1f1f1
  border-top 1px solid #f1f1f1
  i
    &:first-child
      font-size 20px
      padding-right 5px
    &:last-child(3)
      padding-bottom 5px
</style>
